<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">

    <!--对内容进行隐藏-->
    <h1 v-if="isshow" >{{aa}}</h1>
    <!--当我点击显示或者隐藏按钮的时候，隐藏相应的值-->

    <button @click="test()">隐藏</button>

    <!--v-if和v-show比较
        v-if对页面标签进行显示和隐藏
        v-show对css里面的display进行展示和隐藏的


    -->
</div>
</body>
</html>

<script src="resource/vue.js"></script>

<script>


    new Vue({
        el:app,
        data: {
            aa: 122,
            isshow:true,
        },
        methods:{
            test(){
                 if(this.isshow==true){
                    this.isshow=false;
                 }else {
                     this.isshow=true;
                 }
            }
        },
    });





</script>